#{extends 'logged_user.html' /}
#{set title:'Create Request' /}

#{set 'moreStyles'}
<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/datepicker.css'}">
#{/set}

#{set 'moreScripts'}
<script src="@{'/public/javascripts/datepicker.js'}" type="text/javascript" charset="${_response_encoding}"></script>
<script src="@{'/public/javascripts/create-offer.js'}" type="text/javascript" charset="${_response_encoding}"></script>
#{/set}

#{if requestItem.id}
<h3 style="padding-top:0px;">Edit Request</h3>
<p>Use the form below to edit your request.</p>
#{/if}
#{else}
<h3 style="padding-top:0px;">Create New Request</h3>
<p>Use the form below to create a new request.</p>
#{/else}

<script>

function changeForCounty()
{		
	var ddlC = document.getElementById("ddlCounty");
	
	if(ddlC.options[ddlC.selectedIndex].text == "All")
	{
		document.getElementById("txtCountyName").value = "";
		document.getElementById("txtDistrictName").value = "";
		
		document.getElementById("txtCountyId").value = "";		
		document.getElementById("txtDistrictId").value = "";	
	}
	else
	{
		document.getElementById("txtCountyName").value = ddlC.options[ddlC.selectedIndex].text;
		document.getElementById("txtDistrictName").value = "";
		
		document.getElementById("txtCountyId").value = ddlC.options[ddlC.selectedIndex].value;	
		document.getElementById("txtDistrictId").value = "";
	}
		
	fillDistricts(ddlC.options[ddlC.selectedIndex].value);
}

function changeForDistrict()
{	
	var ddlD = document.getElementById("ddlDistrict");
	if(ddlD.options[ddlD.selectedIndex].text == "All")
	{
		document.getElementById("txtDistrictName").value = "";
		document.getElementById("txtDistrictId").value = "";
	}
	else
	{
		document.getElementById("txtDistrictName").value = ddlD.options[ddlD.selectedIndex].text;
		document.getElementById("txtDistrictId").value = ddlD.options[ddlD.selectedIndex].value;
	}
		
}

function fillDistricts(p_county)
{
	var ddlDis = document.getElementById("ddlDistrict");
	
	if(p_county == "0")
	{			
		var tmp = ddlDis.length;
		for(var i=0; i < tmp; i++)
		{	
			ddlDis.remove(0);
		}
		
		addElement("All","0",ddlDis)
		document.getElementById("txtDistrictName").value = "";
		document.getElementById("txtDistrictId").value = "";
	}
	else 
	{
		var tmp = ddlDis.length;
		for(var i=0; i < tmp; i++)
		{	
			ddlDis.remove(0);
		}
		addElement("All","0",ddlDis)
		
		var ddlAllDistrict = document.getElementById("ddlAllDistrict");
		for(var i=0; i < ddlAllDistrict.length; i++)
		{
			var searchStr = "##" + p_county + "##";	
			if(ddlAllDistrict.options[i].text.indexOf(searchStr) > -1)
			{
				addElement(ddlAllDistrict.options[i].text.replace(searchStr,""),ddlAllDistrict.options[i].value, ddlDis);
			}
		}	
	}	
}

function addElement(text,value,ddl)
{ 
	var elOptNew = document.createElement('option');
	elOptNew.text = text;
	elOptNew.value = value;
	
  	try 
	{
		ddl.add(elOptNew, null); // standards compliant; doesn't work in IE
	}
  	catch(ex) {
	    ddl.add(elOptNew); // IE only
	}
}

function enableDays()
{
	var ddlR = document.getElementById("ddlReoccurance") ;
		
	if(ddlR.options[ddlR.selectedIndex].value == 1)
	{
		document.getElementById("spnDays").disabled = "";
		document.getElementById("lblDays").disabled = "";
		document.getElementById("lblAllhours").disabled = "";
		document.getElementById("spnDays").style.color = "#666666";
		document.getElementById("lblDays").style.color = "#666666";	
		document.getElementById("lblAllhours").style.color = "#666666";
		
		document.getElementById("chkAllDays").checked = 1;
		
		document.getElementById("chkMonday").disabled = "";
		document.getElementById("chkTuesday").disabled = "";
		document.getElementById("chkWednesday").disabled = "";
		document.getElementById("chkThursday").disabled = "";
		document.getElementById("chkFriday").disabled = "";
		document.getElementById("chkSaturday").disabled = "";
		document.getElementById("chkSunday").disabled = "";	
		
		document.getElementById("ddlRecTimeFrom").disabled = "";
		document.getElementById("ddlRecTimeTo").disabled = "";
	}
	else
	{
		document.getElementById("spnDays").disabled = "disabled";
		document.getElementById("lblDays").disabled = "disabled";	
		document.getElementById("lblAllhours").disabled = "disabled";
		document.getElementById("spnDays").style.color = "lightgray";	
		document.getElementById("lblDays").style.color = "lightgray";	
		document.getElementById("lblAllhours").style.color = "lightgray";
		
		document.getElementById("chkAllDays").checked = 0;
				
		document.getElementById("chkMonday").disabled = "disabled";
		document.getElementById("chkTuesday").disabled = "disabled";
		document.getElementById("chkWednesday").disabled = "disabled";
		document.getElementById("chkThursday").disabled = "disabled";
		document.getElementById("chkFriday").disabled = "disabled";
		document.getElementById("chkSaturday").disabled = "disabled";
		document.getElementById("chkSunday").disabled = "disabled";	
		
		document.getElementById("chkMonday").checked = 0;
		document.getElementById("chkTuesday").checked = 0;
		document.getElementById("chkWednesday").checked = 0;
		document.getElementById("chkThursday").checked = 0;
		document.getElementById("chkFriday").checked = 0;
		document.getElementById("chkSaturday").checked = 0;
		document.getElementById("chkSunday").checked = 0;		
	
		document.getElementById("ddlRecTimeFrom").disabled = "disabled";
		document.getElementById("ddlRecTimeTo").disabled = "disabled";
		
      	document.getElementById("txt_reocc_start").value = '00:00'
        document.getElementById("txt_reocc_start_val").value = '1'
	    document.getElementById("txt_reocc_start").value = '00:00'
		document.getElementById("txt_reocc_start_val").value = '1'
		 
		document.getElementById("txt_reocc_end").value = '00:00'
	    document.getElementById("txt_reocc_end_val").value = '1'
	    document.getElementById("txt_reocc_end").value = '00:00'
		document.getElementById("txt_reocc_end_val").value = '1'
		
		document.getElementById("ddlRecTimeFrom").options[0].selected = true;
		document.getElementById("ddlRecTimeTo").options[0].selected = true;    	
	}
}

function enableVirtualization(obj)
{	
	if(obj.options[obj.selectedIndex].value == 1)
	{	
		document.getElementById("chkVirtualization").checked = 1;
		
		document.getElementById("ddlCounty").options[0].selected = true;	
		document.getElementById("txtCountyName").value = "";	
		document.getElementById("txtCountyId").value = "";	
		fillDistricts(0);
		
		document.getElementById("liCounty").style.visibility = "hidden";
		document.getElementById("liCounty").style.display = "none";
		
		document.getElementById("liDistrict").style.visibility = "hidden";
		document.getElementById("liDistrict").style.display = "none";
	}
	else 
	{
		document.getElementById("chkVirtualization").checked = 0;
		
		document.getElementById("liCounty").style.visibility = "visible";
		document.getElementById("liCounty").style.display = "";		
		
		document.getElementById("liDistrict").style.visibility = "visible";
		document.getElementById("liDistrict").style.display = "";
	}		
}

function openCloseHours()
{	
	/*
	if(document.getElementById("chkAllHours").checked == 1)
	{
		document.getElementById("ddlRecTimeFrom").disabled = "disabled";
		document.getElementById("ddlRecTimeTo").disabled = "disabled";
	} 
	else
	{		
		document.getElementById("ddlRecTimeFrom").disabled = "";
		document.getElementById("ddlRecTimeTo").disabled = "";
	}*/
}

function setTimeValue(obj, ind)
{ 
	var ddl = obj;
	if(ind == 1)
	{
		document.getElementById("txt_reocc_start").value = ddl.options[ddl.selectedIndex].text;	
		document.getElementById("txt_reocc_start_val").value = ddl.options[ddl.selectedIndex].value;	
	}
	else 
	{
		document.getElementById("txt_reocc_end").value = ddl.options[ddl.selectedIndex].text;	
		document.getElementById("txt_reocc_end_val").value = ddl.options[ddl.selectedIndex].value;	
	}
}
</script>

<form action="@{Requests.doCreate()}" method="POST" class="utility_form">
	<input type="hidden" name="requestItem.id" value="${requestItem.id}" />

  <fieldset>
    <legend>Descriptions</legend>
    
    <ul>
      <li>
        <label style="padding-top:7px">Title</label>
        <input style="width:200px;" type="text" name="requestItem.title" value="${requestItem.title}" />
	<span class="error">#{error 'requestItem.title' /}</span>
      </li>
      <li>
        <label style="padding-top:7px">Tags</label>
        <input style="width:200px;" type="text" name="tags" value="${requestItem.tags.join(' ')}" /> Separate tags with spaces
	<span class="error">#{error 'requestItem.tags' /}</span>
      </li>
      <li>
        <label style="padding-top:7px">Description</label>
        <textarea rows="5" style="width:330px" name="requestItem.description">${requestItem.description}</textarea>
        <span style="position: absolute; padding-top:40px" class="error">&nbsp;#{error 'requestItem.description' /}</span>
      </li>
      <li>
        <label style="padding-top:7px">Honey Combs</label>
			<select name="requestItem.credit">
	  			<option>1</option>
	  			<option>7</option>
	  			<option>19</option>
			</select>
      </li>     
      <li>
      <label style="padding-top:7px">Is Virtual?</label>  
     		<select id="ddlVirtualization" onchange="enableVirtualization(this);">
  			<option value="0" selected="selected">No</option>
  			<option value="1">Yes</option>	  			
		</select>
      		Via online interaction, chat, webcam etc.
      		<input id="chkVirtualization" style="visibility: hidden; display: none" type="checkbox" name="requestItem.is_virtual" ${requestItem.is_virtual ? 'checked':''}  />	
    	</li>      
      <li>
      <li id="liCounty">
      <label style="padding-top:7px">County</label>
      		<select id="ddlCounty" onchange="changeForCounty();">
        #{list items:counties, as:'countyItem'}
	    <option value="${countyItem.county_id}">	      	    
	         ${countyItem.name}        
	    </option>	    
	    #{/list}
	    </select>       		
    	</li>      
      <li id="liDistrict">
      <label style="padding-top:7px">District</label>
      		<select onchange="changeForDistrict();" id="ddlDistrict">
  			<option>All</option>
		</select>
      </li>       
      <select id="ddlAllDistrict" style="display:none; visibility:hidden;">
       #{list items:districts, as:'districtItem'}
    <option value="${districtItem.district_id}">	      	    
          ##${districtItem.county_id}##${districtItem.name}        
    </option>	    
    #{/list}
    </select>         
      <li style="visibility: hidden; display:none">
      <label>City</label>
      	<input type="text" id="txtCityName" name="requestItem.city_name" value="${requestItem.city_name}" />
      	</li>  
      <li style="visibility: hidden; display:none">
      <label>County</label>
      	<input type="text" id="txtCountyName" name="requestItem.county_name" value="${requestItem.county_name}" />
      	</li>
      <li style="visibility: hidden; display:none">
      <label>District</label>
      <input type="text" id="txtDistrictName" name="requestItem.district_name" value="${requestItem.district_name}" />
       </li>
      <li style="visibility: hidden; display:none">
      <label>City_Id</label>
      	<input type="text" id="txtCityId" name="requestItem.city.id" value="${requestItem.city}" />
      	</li>  
      <li style="visibility: hidden; display:none">
      <label>County_Id</label>
      	<input type="text" id="txtCountyId" name="requestItem.county.id" value="${requestItem.county}" />
      	</li>
      <li style="visibility: hidden; display:none">
      <label>District_Id</label>
      <input type="text" id="txtDistrictId" name="requestItem.district.id" value="${requestItem.district}" />
       </li>
    </ul>
  </fieldset>  
  <fieldset>
    <legend>Limitations</legend>
    <ul>
      <li>
        <label style="padding-top:7px">Valid Until</label>
        <input id="txt_val_until" readonly="readonly" type="text" name="requestItem.endDate" class="date_pick" value="${requestItem.endDate}" />
		<span class="error">#{error 'requestItem.endDate' /}</span>
      </li>      
    </ul>    
    <ul style="padding-top:4px;">
   	 <li>
        <label style="padding-top:10px">Is Recurrent?</label>    
       		<select id="ddlReoccurance" onchange="enableDays();">
	  			<option value="0" selected="selected">No</option>
	  			<option value="1">Yes</option>	  			
			</select>&nbsp;Will this offer recur?
       		<input id="chkAllDays" type="checkbox" style="display:none;visibility:hidden" name="requestItem.reoccure" ${requestItem.reoccure ? 'checked':''}  />	

       		<label style="width:400px;display:block;padding-left:215px;text-indent:-15px;padding-top:12px;">
            <span id="spnDays" style="color:lightgray" disabled="disabled">Monday&nbsp;&nbsp;
       		<input id="chkMonday" disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-4px;*overflow:hidden;border:none;" 
       			   type="checkbox" name="requestItem.is_rec_monday" ${requestItem.is_rec_monday ? 'checked':''} />&nbsp;&nbsp;&nbsp;&nbsp;Tuesday
       		<input id="chkTuesday" disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-4px;*overflow:hidden;border:none;" 
       			   type="checkbox" name="requestItem.is_rec_tuesday" ${requestItem.is_rec_tuesday ? 'checked':''}/>&nbsp;&nbsp;&nbsp;&nbsp;Wednesday
       		<input id="chkWednesday" disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-4px;*overflow:hidden;border:none;" 
       			   type="checkbox" name="requestItem.is_rec_wednesday" ${requestItem.is_rec_wednesday ? 'checked':''}/></span></label>  
       		<label id="lblDays" disabled="disabled" style="color:lightgray;padding-top:7px;padding-bottom:7px; width:400px;display:block;padding-left:215px;text-indent:-15px;">Thursday
       		<input id="chkThursday" disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-4px;*overflow:hidden;border:none;" 
       			   type="checkbox" name="requestItem.is_rec_thursday" ${requestItem.is_rec_thursday ? 'checked':''}/>&nbsp;&nbsp;&nbsp;&nbsp;Friday&nbsp;&nbsp;&nbsp;
       		<input id="chkFriday" disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-4px;*overflow:hidden;border:none;" 
       			   type="checkbox" name="requestItem.is_rec_friday" ${requestItem.is_rec_friday ? 'checked':''}/>&nbsp;&nbsp;&nbsp;&nbsp;Saturday&nbsp;&nbsp;&nbsp;
       		<input id="chkSaturday" disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-4px;*overflow:hidden;border:none;" 
       			   type="checkbox" name="requestItem.is_rec_saturday" ${requestItem.is_rec_saturday ? 'checked':''}/>&nbsp;&nbsp;&nbsp;&nbsp;Sunday
       		<input id="chkSunday" disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-4px;*overflow:hidden;border:none;" 
       			   type="checkbox" name="requestItem.is_rec_sunday" ${requestItem.is_rec_sunday ? 'checked':''}/></label>  
		</li>
    </ul> 
    <ul style="padding-top:4px;">
    	<li>
        <label>&nbsp;</label>       		
       		<label id="lblAllhours" disabled="disabled" style="color:lightgray; width:360px;display:block;padding-left:15px;padding-top:4px;padding-bottom:7px;text-indent:-15px;">Reccuring between&nbsp;&nbsp;   		
       		<!--<input disabled="disabled" style="width:13px;height:13px;padding:0;margin:0;vertical-align:bottom;position:relative;top:-13px;*overflow:hidden;border:none;" 
       			   onclick="openCloseHours();" id="chkAllHours" type="checkbox" name="requestItem.is_all_hours" ${requestItem.reoccure ? 'checked':''} />&nbsp;&nbsp;&nbsp;&nbsp; -->          		
       		<select onchange="setTimeValue(this,1)" id="ddlRecTimeFrom" disabled="disabled">
       		 #{list items:recoccurancehouritems, as:'recoccurancehouritem'}
		    <option value="${recoccurancehouritem.val}">	      	    
		          ${recoccurancehouritem.hour_min}  
		    </option>	    
		    #{/list}
			</select>
			- 
			<select onchange="setTimeValue(this,2)" id="ddlRecTimeTo" disabled="disabled">
       		 #{list items:recoccurancehouritems, as:'recoccurancehouritem'}
		    <option value="${recoccurancehouritem.val}">	      	    
		          ${recoccurancehouritem.hour_min}  
		    </option>	    
		    #{/list}
			</select></label>
		</li>
    </ul>     
  </fieldset>

<input type="text" style="visibility:hidden; display: none" id="txt_reocc_start" name="requestItem.reocc_start_hour" value="${requestItem.reocc_start_hour}"/>
<input type="text" style="visibility:hidden; display: none" id="txt_reocc_end" name="requestItem.reocc_end_hour" value="${requestItem.reocc_end_hour}"/>
<input type="text" style="visibility:hidden; display: none" id="txt_reocc_start_val" name="requestItem.reocc_start_hour_val" value="${requestItem.reocc_start_hour_val}"/>
<input type="text" style="visibility:hidden; display: none" id="txt_reocc_end_val" name="requestItem.reocc_end_hour_val" value="${requestItem.reocc_end_hour_val}"/>
<input type="submit" value="Submit" />
</form>

<script>
document.getElementById("txtCityName").value = "Istanbul";
document.getElementById("txtCityId").value = "1";

if(document.getElementById("txtCountyName").value != "")
{
	try
	{
		var ddlC = document.getElementById("ddlCounty");
		for(var i = 0; i< ddlC.length; i++)
		{
			if(ddlC.options[i].text == document.getElementById("txtCountyName").value)
			{
				ddlC.options[i].selected = true;
				fillDistricts(ddlC.options[i].value);
				document.getElementById("txtCountyId").value = ddlC.options[i].value;
				break;
			}		
		}
	}catch(err){}
}

if(document.getElementById("txtDistrictName").value != "")
{
	try
	{
		var ddlD = document.getElementById("ddlDistrict");
		for(var i = 0; i< ddlD.length; i++)
		{
			if(ddlD.options[i].text == document.getElementById("txtDistrictName").value)
			{
				ddlD.options[i].selected = true;
				document.getElementById("txtDistrictId").value = ddlD.options[i].value;
				break;
			}		
		}
	}catch(err){}
}

if(document.getElementById("chkAllDays").checked == 1)
{
	 document.getElementById("ddlReoccurance").options[0].selected = "false";
	 document.getElementById("ddlReoccurance").options[1].selected = "true";
	 
	 document.getElementById("lblAllhours").disabled = "";
	 document.getElementById("spnDays").disabled = "";
	 document.getElementById("lblDays").disabled = "";
	 document.getElementById("spnDays").style.color = "#666666";
	 document.getElementById("lblDays").style.color = "#666666";
	 document.getElementById("lblAllhours").style.color = "#666666";	
	
	 document.getElementById("chkMonday").disabled = "";
	 document.getElementById("chkTuesday").disabled = "";
	 document.getElementById("chkWednesday").disabled = "";
	 document.getElementById("chkThursday").disabled = "";
	 document.getElementById("chkFriday").disabled = "";
	 document.getElementById("chkSaturday").disabled = "";
	 document.getElementById("chkSunday").disabled = "";
	 
	 document.getElementById("ddlRecTimeFrom").disabled = "";
	 document.getElementById("ddlRecTimeTo").disabled = "";
}	

if(document.getElementById("chkVirtualization").checked == 1)
{
	document.getElementById("ddlVirtualization").options[1].selected = true;	
	document.getElementById("ddlCounty").options[0].selected = true;	
	document.getElementById("txtCountyName").value = "";	
	document.getElementById("txtCountyId").value = "";	
	fillDistricts(0);
	
	document.getElementById("liCounty").style.visibility = "hidden";
	document.getElementById("liCounty").style.display = "none";
	
	document.getElementById("liDistrict").style.visibility = "hidden";
	document.getElementById("liDistrict").style.display = "none";
}

if(document.getElementById("txt_reocc_start_val").value !="")
{
	var obj = document.getElementById("ddlRecTimeFrom");
	try
	{
		for(var i = 0; i < obj.length; i++)
		{
			if(obj.options[i].value == document.getElementById("txt_reocc_start_val").value)
			{
				obj.options[i].selected = true;
				break;
			}		
		}
	}catch(err){}
}

if(document.getElementById("txt_reocc_end_val").value !="")
{
	var obj = document.getElementById("ddlRecTimeTo");
		
	try
	{
		for(var i = 0; i< obj.length; i++)
		{
			if(obj.options[i].value == document.getElementById("txt_reocc_end_val").value)
			{
				obj.options[i].selected = true;
				break;
			}		
		}
	}catch(err){}
}
	
if(document.getElementById("txt_reocc_start").value =="")
{
	document.getElementById("txt_reocc_start").value = '00:00'
	document.getElementById("txt_reocc_start_val").value = '1'
}

if(document.getElementById("txt_reocc_end").value =="")
{
	document.getElementById("txt_reocc_end").value = '00:00'
	document.getElementById("txt_reocc_end_val").value = '1'
}

if(document.getElementById("txt_val_until").value.indexOf(" 00:00:00.0") > -1)
{
	document.getElementById("txt_val_until").value = document.getElementById("txt_val_until").value.replace(" 00:00:00.0","");
}

if(document.getElementById("txt_val_until").value.indexOf("-") == -1)
{
	document.getElementById("txt_val_until").value = "";
}
</script>
